<!-- 订单备注页面 -->
<template name='goods_disabled'>
	<view class="width100 " @click.stop>
		<!-- 增加/修改 客户 遮罩层 -->
		<uni-popup ref="disabledGoods" type="center"  width="90%" height="100%">
			<view class="top-but menu-scroll-w" >
				<view class="top-but-box">
			
					<view class="input_confirms maxwidth250">
						<uni-data-select
						:localdata="$routeData.getRoute()"
						v-model="headerSearch.route_id"
						@change="(e)=>{$routeData.SetNowRoute(e),formsubmit(e)}"
						placeholder="选择仓库线路"
						placeholder-class="placeholder-class"
						class="color-e40318 floatleft"
						></uni-data-select>
					</view>
					
					<view class="input_confirms maxwidth250" >
						<uni-data-select
						:localdata="$routeData.getGroup()"
						v-model="headerSearch.group_id"
						@change="(e)=>{$global.setStorageRoute('group',e),updateData(e)}"
						placeholder="选择用户分组"
						placeholder-class="placeholder-class"
						class="color-e40318 floatleft"
						></uni-data-select>
					</view>
					
					<view class="input_confirms maxwidth250" >
						<uni-data-select
						:localdata="$routeData.getLevel()"
						v-model="headerSearch.level_id"
						@change="(e)=>{$global.setStorageRoute('level_id',e),updateData(e)}"
						placeholder="选择价格等级"
						placeholder-class="placeholder-class"
						class="color-e40318 floatleft"
						></uni-data-select>
					</view>
					
					<!-- 搜索 -->
					<view class="w333 flex">
						<view class="searchBox floatleft" >
							<view class="riskTitle">搜索:</view>
							<input
							v-model="headerSearch.word" 
							placeholder="输入客户档口 人名 手机 拼音进行搜索"
							placeholder-class="placeholder-class"
							@confirm="$common.noMultipleClicks('updateData',updateData,true)"
							class="search-ipu w200"
							/>
							<view class="delete-ipu" v-if="headerSearch.word!=''" @click="headerSearch.word=''">
								<img src="../../static/img/delete-1.png"></img>
							</view>
						</view>
					</view>

					<view @click="$common.noMultipleClicks('updateData',updateData,true)" 
					class="add_color search-but" >
						<img src="../../static/img/search.png" class="img" ></img>
						刷新
					</view>
					
					<view 
						@click="settingAll(true)" 
						class="back_color search-but floatleft" 
					>
						<!-- <img src="../../static/img/delete.png" class="ico"></img> -->
						设置当前客户为禁止销售
					</view>
					
					<view 
						@click="settingAll(false)" 
						class="add_color search-but" 
					>
						<!-- <img src="../../static/img/delete.png" class="ico"></img> -->
						取消当前客户为禁止销售
					</view>
				</view>
				
			</view>
			<view>
				<view class="tips tips-left">当前被禁止销售的客户：（被禁止销售后，业务员或当前顾客将无法在小程序或后台进行下单）</view>
			</view>
			<view class="boxD">
				<view v-for="(item,index) in goodsDisabledList" :key="index" class="fontw"
				@click="deleteUid(item.user_id)">
					{{item.name}}
				</view>
			</view>
			
			
			<map
			style="width: 100%;height: 100%;"
			:longitude="$routeData.getLatlng().longitude"
			:latitude="$routeData.getLatlng().latitude"
			:markers="markers"
			:include-points="include_points.length ? include_points:[{longitude:$routeData.getLatlng().longitude,latitude:$routeData.getLatlng().latitude}]"
			@callouttap="callouttap"
			></map>
			
		</uni-popup>
		<!-- end -->
	</view>
</template>
<script>
	export default{
		name:'goods_disabled',
		components: {
		},
		data(){
			return{
				markers:[],
				include_points:[],
				headerSearch:{//左边的树形框 搜索
					route_id:'',//获取某个目录下的商品
					group_id:'0',
					level_id:'0',
					word:''
				},
				globalGoods:{
					id:'',
					idArr:'',
					type:0,//0=文本型
				},
				goodsDisabledList:[]
			}
		},
		 // 此处定义传入的数据
		props: {
		},
		watch: {
		},
		created() {
			var that = this
			let route = this.$routeData.GetNowRoute()
			this.headerSearch.route_id = route
			
		},
		methods:{
			settingAll(confirm){
				var that = this
			
				if(confirm == true){
					var content = `设置当前筛选项下的客户进行禁止销售吗？`
					var confirmText = "禁止"
			
				}else{
					var content = `取消当前筛选项下的客户禁止销售吗？`
					var confirmText = "解除"
			
				}
				var userIdArr = []
				var list = that.markers
				for (var ii=0;ii<list.length;ii++) {
					userIdArr.push(list[ii].id)
				}
				
				
				uni.showModal({
					title:'提示',
					content:content,
					confirmText:confirmText,
					success:(res)=>{
						if (res.confirm) {
							that.markers = []
							
							if(that.globalGoods.type == 2){
								var goodsIdData = JSON.stringify(that.globalGoods.idArr)
								
							}else{
								var goodsIdData = JSON.stringify([that.globalGoods.id])
							}
							
							if(confirm == true){
								
								that.$common.get_request(
									{
										type: 'SetGoodsName',
										goods_id: goodsIdData,
										user_id: JSON.stringify(userIdArr),
									},
									(res)=>{
										that.GetGoodsDisabledList(()=>{
											that.loadData()
										})
									}
								);
			
							}else{
								that.$common.get_request(
									{
										type: 'deleteGoodsName',
										goods_id: goodsIdData,
										user_id: JSON.stringify(userIdArr),
									},
									(res)=>{
										that.GetGoodsDisabledList(()=>{
											that.loadData()
										})
									}
								);
							}
						}
			
					}
				})
			},
			updateData(){
				var that = this
				this.GetGoodsDisabledList(()=>{
					that.loadData()
				})
			},
			open(goodsIdArr){
				var that = this

				if(Array.isArray(goodsIdArr) && goodsIdArr.length>=1){
					this.globalGoods.idArr = goodsIdArr
					this.globalGoods.type = 2
				}else{
					this.globalGoods.id = goodsIdArr
					this.globalGoods.type = 1
				}
				this.goodsDisabledList = []
				this.$refs.disabledGoods.open()
				this.GetGoodsDisabledList(()=>{
					that.loadData()
				})
			},
			deleteUid(uid){
				this.callouttap({detail:{markerId:uid}})
			},
			callouttap(res){
				var that = this

				var index = this.GetMarkersId(res.detail.markerId)
				if(index == -1){
					return 
				}

				var isDisabled = that.markers[index].isDisabled
				var user_id = that.markers[index].user_id
				var userName = that.markers[index].callout.content
				if(isDisabled == false){
					var content = `对此【${userName}】客户禁止销售吗？`
					var confirmText = "禁止"

				}else{
					var content = `对此【${userName}】客户解除禁止销售吗？`
					var confirmText = "解除"

				}
				uni.showModal({
					title:'提示',
					content:content,
					confirmText:confirmText,
					success:(res)=>{
						if (res.confirm) {
							var list = that.markers
							that.markers = []
							if(that.globalGoods.type == 2){
								var goodsIdData = JSON.stringify(that.globalGoods.idArr)
								
							}else{
								var goodsIdData = JSON.stringify([that.globalGoods.id])
							}
							
							if(isDisabled == false){
								
								
								that.$common.get_request(
									{
										type: 'SetGoodsName',
										goods_id: goodsIdData,
										user_id: JSON.stringify([user_id]),
									},
									(res)=>{
										list[index].isDisabled = true
										list[index].callout.bgColor    = '#fd9919'
										
										 that.markers = list; // 重新设置 markers
										 that.goodsDisabledList.push({user_id:user_id,name:userName})
										 
									}
								);

							}else{
								that.$common.get_request(
									{
										type: 'deleteGoodsName',
										goods_id: goodsIdData,
										user_id: JSON.stringify([user_id]),
									},
									(res)=>{
										list[index].isDisabled = false
										list[index].callout.bgColor    = '#333'
										that.markers = list; // 重新设置 markers
										var i = that.GetCheckGoodsDisabledListExists(user_id)
										if(i>=0){
											that.goodsDisabledList.splice(i,1)
										}
									}
								);
							}
						}

					}
				})
			},
		
		
			/**
			 * 分类插件回调返回
			*/
			formsubmit(e){
				this.headerSearch.word  = ''
				this.headerSearch.route_id = e
				this.updateData()
			},
			
			/**
			 * 查询被禁止销售的客户
			*/
			GetGoodsDisabledList(call){
				var that = this
				if(this.globalGoods.type == 2){
					if(call){
						call()
					}
					return 
				}
				that.$common.get_request(
					{
						type: 'GetGoodsDisabledList',
						goods_id: that.globalGoods.id,
					},
					(res)=>{
						that.goodsDisabledList = res.list
						if(call){
							call()
						}
					}
				);
			},
			/**
			 * 读取用户
			 * type : goods_list|goods_search
			 * */
			loadData(isUpdatePage=true){
				var that = this
				that.$common.get_request(
					{
						type:'firm_user_list',
						search:that.headerSearch.word,//搜索内容
						route_id: that.headerSearch.route_id,//获取某个目录下的商品
						group_id: that.headerSearch.group_id,//获取某个目录下的商品
						level_id: that.headerSearch.level_id,//获取某个目录下的商品
						is_map:1
					},
					(res)=>{
						if(res.list.length==0){
							that.$common.toast("查找失败，可以试试更换关键字")
							return
						}
						let json            = {}
						let latlng          = {}
						let markersTmp      = {}
						var arr             = []
						var markersTmpArr   = []
						that.include_points = []
						that.markers        = []
						var bgColor         = ""
						for (var ii=0;ii<res.list.length;ii++) {
							if(res.list[ii].latlng){

								json = JSON.parse(res.list[ii].latlng)
								if(json!=undefined && json.lat>0){
									latlng.latitude  = json.lat
									latlng.longitude = json.lng

									//区分热门
									if(that.GetCheckExists(res.list[ii].id) == false){
										bgColor = '#333'
										var isDisabled = false
									}else{
										bgColor = '#d18d36'
										var isDisabled = true
										
									}
									// console.log(res.list[ii].id)
									markersTmp = that.createMarkersUser(
										latlng,
										res.list[ii].id,
										'/static/map/dingwei.png',
										res.list[ii].name,
										isDisabled,
										bgColor,
										{
											user_id:res.list[ii].id,
											//goods_id:that.globalGoodsId
										}
									)
									arr.push(markersTmp)
									markersTmpArr.push(markersTmp)
								}
								
							}
						}
						that.include_points = arr
						that.markers = markersTmpArr
					}
				);
			},
			
			GetCheckExists(user_ids){
				var list = this.goodsDisabledList
				for (var ii=0;ii<list.length;ii++) {
					if(list[ii].user_id == user_ids){
						return true
					}
				}
				return false
			},
			
			GetCheckGoodsDisabledListExists(user_ids){
				var list = this.goodsDisabledList
				for (var ii=0;ii<list.length;ii++) {
					if(list[ii].user_id == user_ids){
						return ii
					}
				}
				return -1
			},
			GetMarkersId(MarkersId){
				var list = this.markers
				for (var ii=0;ii<list.length;ii++) {
					if(list[ii].id == MarkersId){
						return ii
					}
				}
				return -1
			},
			/**
			 * 创建用户标记点 
			 * */
			createMarkersUser(location,user_id,avatar,callout_content,isDisabled,bgColor,obj) {
				var that = this
				let markerItem = {
					id: parseFloat(user_id),
					latitude: location.latitude,
					longitude: location.longitude,
					iconPath: avatar,
					width: 15,
					height: 15,
					isDisabled:isDisabled,
					user_id:obj.user_id,
					//goods_id:obj.goods_id,
					callout:{
						textAlign:'center',
						bgColor:bgColor,
						color:'#fff',
						content: callout_content,
						display: 'ALWAYS',//'BYCLICK':点击显示; 'ALWAYS':常显
						borderRadius:10,
						padding:5,
						fontSize:12
					},
				}
				return markerItem;
			},
		}
	}
</script>

<style>
	.tips-left{
		text-align: left;
		    padding-left: 15px;
	}
	.boxD{
		font-size: 14px;
		display: flex;
		padding: 10px;
		border-bottom: solid 1px #3333331c;
		padding-left: 5px;
		overflow: auto;
	}
	.fontw{
		padding: 0px 10px;
		color: #0074ef;
		font-weight: 600;
		cursor: pointer;
	}
</style>
